<#assign module="sys"/>

<@override name="header">
</@override>
<@override name="body">

	<div class="row">
		<div class="col-md-12">
			<div class="panel panel-default">
				<div class="panel-heading">
					修改密码
			    </div>
			    <div class="panel-body">
    				<form id="submit_form" action="${ctx}/changepassword" class="form-horizontal" method="post">

		               	<div class="form-group">
		                    <label class="col-sm-3 control-label"><em>*</em>原密码：</label>
		                    <div class="col-sm-3">
		                    	<input class="form-control" id="oldpassword" name="oldpassword" type="password" required placeholder="输入原密码"/>
		                    </div>
		                </div>
		               
		                <div class="form-group">
		                    <label class="col-sm-3 control-label"><em>*</em>密码：</label>
		                    <div class="col-sm-3">
		                    	<input class="form-control" id="password" name="password" type="password" required placeholder="密码长度为8到30个字符，采用数字、字母、特殊字符三种组合"/>
		                    </div>
		                </div>
		                
		                <div class="form-group">
		                    <label class="col-sm-3 control-label"><em>*</em>重复密码：</label>
		                    <div class="col-sm-3">
		                    	<input class="form-control" id="passwordconfirm" type="password" required placeholder="需要和密码一致"/>
		                    </div>
		                </div>
		                
		                <!--
		                <div class="form-group">
		                    <video id="video" width="640" height="480" autoplay></video>
							<button id="snap">Snap Photo</button>
							<canvas id="canvas" width="640" height="480"></canvas>
		                </div>
		                -->
    					
		                <div class="form-group" style="margin-left:10px;">
			                <label class="col-sm-3 control-label"></label>
			                <input type="submit" class="btn btn-primary" value="修改">
			            </div>
					</form>
        		</div>
			</div>
		</div>
	</div>

</@override>
<@override name="footer">
<script src="${ctx}/assets/js/md5.js"></script>
<script src="${ctx}/assets/js/base64.js"></script>
<script type="text/javascript">
	<#if message??>
		<#if success>
			$.scojs_message("${message}", $.scojs_message.TYPE_OK);
		<#else>
			$.scojs_message("${message}", $.scojs_message.TYPE_ERROR);
		</#if>
	</#if>
	$(document).ready(function(){
		$("#submit_form").submit(function(){
			var password=$.trim($("#password").val());
			
			if(password.length<8 || password.length>30){
				$.scojs_message("密码长度为8到30个字符。", $.scojs_message.TYPE_ERROR);
				return false;
			}
			
			var password_regex = new RegExp('(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{8,30}');
			if(!password_regex.test(password)){
				$.scojs_message("密码格式不正确，采用数字、字母、特殊字符三种组合", $.scojs_message.TYPE_ERROR);
				return false;
			}
			
			var passwordconfirm=$.trim($("#passwordconfirm").val());
			if(password!=passwordconfirm){
				$.scojs_message("密码不一致", $.scojs_message.TYPE_ERROR);
				return false;
			}
			if($("#oldpassword") != ''){
				$("#oldpassword").val(new Base64().encode($.md5($("#oldpassword").val())));
			}
			if($("#password") != ''){
				$("#password").val(new Base64().encode($.md5($("#password").val())));
			}
			
			return true;
		});
		
		
		// Put event listeners into place
		//window.addEventListener("DOMContentLoaded", function() {
			// Grab elements, create settings, etc.
			//var canvas = document.getElementById("canvas"),
			//context = canvas.getContext("2d"),
			//video = document.getElementById("video"),
			//videoObj = { "video": true },
			//errBack = function(error) {
				//console.log("Video capture error: ", error.code); 
			//};
			
			//document.getElementById("snap").addEventListener("click", function() {
				//context.drawImage(video, 0, 0, 640, 480);
			//});
		
			// Put video listeners into place
			//if(navigator.getUserMedia) { // Standard
				//navigator.getUserMedia(videoObj, function(stream) {
					//video.src = stream;
					//video.play();
				//}, errBack);
			//} else if(navigator.webkitGetUserMedia) { // WebKit-prefixed
				//navigator.webkitGetUserMedia(videoObj, function(stream){
					//video.src = window.webkitURL.createObjectURL(stream);
					//video.play();
				//}, errBack);
			//}
			//else if(navigator.mozGetUserMedia) { // Firefox-prefixed
				//navigator.mozGetUserMedia(videoObj, function(stream){
					//video.src = window.URL.createObjectURL(stream);
					//video.play();
				//}, errBack);
			//}
		//}, false);
	
	
	});
	
	
</script>
</@override>
<@extends name="layout.ftl"/>